// 注册
Vue.component('el-dialog-trade', {
    props: ["id"],
    template: '<el-dialog\n' +
        '\t\t\ttitle="交易详情"\n' +
        '\t\t\t:visible.sync="dialogVisible"\n' +
        '\t\t\twidth="80%" :before-close="handleClose">' +
        '<el-collapse v-model="activeNames" >\n' +
        '\t\t\t<el-collapse-item  v-for="item in processList" @click.native="queryTradeProcessData(item)" :disabled="item.status == \'0\'?true:false">\n' +
        '\t\t\t\t<template slot="title">\n' +
        '\t\t\t\t\t{{item.updateDate}}\n' +
        '\t\t\t\t\t&nbsp;<i v-if="item.status == \'0\'" class="el-icon-circle-close" style="font-size: 20px;"></i>\n' +
        '\t\t\t\t\t<i v-if="item.status == \'1\'" class="el-icon-success" style="color: #00B83F;font-size: 20px;"></i>\n' +
        '\t\t\t\t\t<i v-if="item.status == \'2\'" class="el-icon-circle-plus" style="color: #00B83F;font-size: 20px;"></i>  {{item.name}}\n' +
        '\t\t\t\t</template>\n' +
        '\t\t\t\t<el-timeline  style="margin-left: 133px;">\n' +
        '\t\t\t\t<el-timeline-item\n' +
        '\t\t\t\t\t\tv-for="processDataList in item.processDataList"\n' +
        '\t\t\t\t\t\tcolor="#0bbd87"\n' +
        '\t\t\t\t\t\tsize="large"\n' +
        '\t\t\t\t\t\t>\n' +
        '\t\t\t\t\t{{processDataList.name}}\n' +
        '\t\t\t\t\t<div>\n' +
        '\t\t\t\t\t\t<span><i class="el-icon-time"></i> {{processDataList.createDate}}</span></br>\n' +
        '\t\t\t\t\t\t<el-link type="primary" @click="queryTradeDetail(item.id,processDataList.stepNum)">详情数据</el-link>\n' +
        '\t\t\t\t\t</div>\n' +
        '\t\t\t\t</el-timeline-item>\n' +
        '\t\t\t\t</el-timeline>\n' +
        '\t\t\t</el-collapse-item>\n' +
        '\t\t</el-collapse>\n' +
        '\n' +
        '\t\t<el-dialog\n' +
        '\t\t\t\twidth="60%"\n' +
        '\t\t\t\ttitle="详情数据"\n' +
        '\t\t\t\t:visible.sync="innerVisible"\n' +
        '\t\t\t\tappend-to-body>\n' +
        '\t\t\t<vue-form\n' +
        '\t\t\t\t\tv-model="formData"\n' +
        '\t\t\t\t\t:ui-schema="uiSchema"\n' +
        '\t\t\t\t\t:schema="schema"\n' +
        '\t\t\t\t\t:form-props="formProps"\n' +
        '\t\t\t>\n' +
        '\t\t\t</vue-form>\n' +
        '\t\t</el-dialog>' +
        '\t</el-dialog>',
    data:function(){
        return{
            dialogVisible:true,
            innerVisible:false,		// 详情数据
            activeNames: [],
            processList:[], // 流程集合
            formData:{},
            uiSchema:{},
            schema:{},
            formProps:{},
            formFooter:{}
        }
    },
    mounted() {
        this.queryTradeInfo();
    },
    methods: {

        handleClose(done) {
            this.$emit("close-el-dialog")
        },

        // 详情数据查看
        queryTradeDetail(processId,stepNum){
            var vue = this;
            vue.formData = {};
            let obj = {
                processId : processId,
                stepNum:stepNum
            };
            var p = axios.get(BASE_WEB + "trade/processInfoDataDetail",{params:obj});
            p.then(function (result) {
                vue.formData = JSON.parse(result.data.data);
                let templateData = JSON.parse(result.data.templateData);
                vue.schema = templateData.schema;
                if(result.data.uiSchema !=null){
                    vue.uiSchema = JSON.parse(result.data.uiSchema);
                }
                vue.formFooter = templateData.formFooter;
                vue.formProps = templateData.formProps;
                vue.innerVisible = true;
            }).catch(function (error) {
                console.log(error);
            })
        },

        //获取阶段数据
        queryTradeInfo(id){
            var vue = this;
            var p = axios.get(BASE_WEB + "trade/info",{params:{id:vue.id}});
            p.then(function (result) {
                vue.processList = result.data.processList;
            }).catch(function (error) {
                console.log(error)
            })
        },

        // 根据阶段id 获取流程概要数据
        queryTradeProcessData(item){
            var vue = this;
            if(!item.processDataList){
                var p = axios.get(BASE_WEB + "trade/processInfoData",{params:{processId:item.id}})
                p.then(function (result) {
                    item.processDataList = result.data.processDataList;
                }).catch(function (error) {
                    console.log(error);
                })
            }
        }
    }
})

